﻿<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="../../../assets/docs.css" rel="stylesheet" type="text/css" media="screen" />
<title>MooTools Documentation - Element/Element.Pin</title>
</head>

<body>
  <div class="doc">
    <div class="methods">
			<h4 class="menu-item"><a href="#Element">Element</a></h4>
			<div class="menu-item"><a href="#Element:pin">pin</a></div>
			<div class="menu-item"><a href="#Element:unpin">unpin</a></div>
			<div class="menu-item"><a href="#Element:togglepin">togglepin</a></div>
    </div>
    <div class="l-border r-border span-15 content">
				<h1 id="Element"><a href="#Element">Type: Element</a></h1>

<p class="description">Extends the <a href="../../core/Element/Element.html">Element</a> Type to include the <em>pin</em> method useful for fixed positioning for elements.</p>

<h3>Tutorial/Demo</h3>

<ul>
<li><a href="http://www.clientcide.com/wiki/cnet-libraries/04-element/03-element.pin">Online Tutorial/Demo</a></li>
</ul>
<h2 id="Element:pin"><a href="#Element:pin">Element Method: pin</a></h2>

<p class="description">Affixes an element at its current position, even if the window is scrolled.</p>

<h3>Arguments</h3>

<ol>
<li>pin - (<em>boolean</em>, optional) <em>true</em>: pins the element; <em>false</em>: unpins the element; defaults to <em>true</em>; See also <a href="#Element:unpin">Element:unpin</a>.</li>
</ol>
<h3>Syntax</h3>

<pre class="javascript">$<span class="br0">(</span><span class="st0">'myElement'</span><span class="br0">)</span>.<span class="me1">pin</span><span class="br0">(</span><span class="br0">)</span>;
</pre>

<h3>Returns</h3>

<ul>
<li>(<em>element</em>) This Element.</li>
</ul>
<h2 id="Element:unpin"><a href="#Element:unpin">Element Method: unpin</a></h2>

<p class="description">Un-pins an element at its current position (see <a href="#Element:pin">Element:pin</a>).</p>

<h3>Syntax</h3>

<pre class="javascript">$<span class="br0">(</span><span class="st0">'myElement'</span><span class="br0">)</span>.<span class="me1">unpin</span><span class="br0">(</span><span class="br0">)</span>;
</pre>

<h3>Returns</h3>

<ul>
<li>(<em>element</em>) This Element.</li>
</ul>
<h2 id="Element:togglepin"><a href="#Element:togglepin">Element Method: togglePin</a></h2>

<p class="description">Toggles the pin state of the element.</p>

<h3>Syntax</h3>

<pre class="javascript">$<span class="br0">(</span><span class="st0">'myElement'</span><span class="br0">)</span>.<span class="me1">togglePin</span><span class="br0">(</span><span class="br0">)</span>;
</pre>

<h3>Returns</h3>

<ul>
<li>(<em>element</em>) This Element.</li>
</ul>
    </div>
  </div>
<script type="text/javascript" src="../../../assets/mootools-core-1.3.js"></script>
<script type="text/javascript" src="../../../assets/mootools-more-smoothscroll.js"></script>
<script type="text/javascript" src="../../../assets/doc-assist.js"></script>
</body>
</html>
